<template>
  <div>
    <myHeader></myHeader>
    <div v-show="loading">正在加载......</div>
    <h2 v-text="data.title"></h2>
    <p>作者：{{ NameLogin.loginname }}  发表时间：{{ $utils.goodTime(data.create_at) }}</p>
    <hr>
    <article v-html="data.content"></article>
    <h3>网友回复：</h3>
    <ul>
      <li v-for="(item,index) in data.replies" :key="index">
        <p>评论者：{{ item.author.loginname }}</p> 评论时间：{{ $utils.goodTime(item.create_at) }}
        <article v-html="item.content"></article>
      </li>
    </ul>
    <myFooter></myFooter>
  </div>
</template>

<script>
import myHeader from '../components/Header.vue'
import myFooter from '../components/Footer.vue'
export default {
  components: {
    myHeader,
    myFooter
  },
  data () {
    return {
      loading: true,
      id: this.$route.params.id,
      data: {},
      NameLogin: '',
      myHtml: ''
    }
  },
  created () {
    console.log(this.$route)
    this.getData()
  },
  methods: {
    getData () {
      this.$api.get('topic/' + this.id, null, r => {
        console.info(r.data)
        this.data = r.data
        this.NameLogin = r.data.author
        this.loading = false
      })
    }
  }
}
</script>

<style>

</style>
